<template>
	<view class="page-detail">
		<!--轮播图-->
		<view class="swiper">
			<swiper :indicator-dots="indicatorDots" :duration="1000" :autoplay="autoplay" :interval="3000">
				<swiper-item>
					<view class="swiper-item">
						<image class="swiper-img" src="../../static/index/banner1.jpg" mode="aspectFill"></image>
					</view>
				</swiper-item>
				<swiper-item>
					<view class="swiper-item">
						<image class="swiper-img" src="../../static/index/banner2.jpg" mode="aspectFill"></image>
					</view>
				</swiper-item>
				<swiper-item>
					<view class="swiper-item">
						<image class="swiper-img" src="../../static/index/banner3.jpg" mode="aspectFill"></image>
					</view>
				</swiper-item>
			</swiper>
		</view>

		<!--价格、名称、说明-->
		<view class="name-box">
			<!-- 新增的优惠图片视图 -->
				<view class="discount-image">
					<image class="img" src="../../static/images/discounted.png"></image>
				</view>
			<view class="name">
				柯基
			</view>
			<view class="action-box">
				<view class="price-box">
					<view class="price">
						<view class="discounted-price">
							￥1500
						</view>
						<view class="original-price">
							￥2008
						</view>
					</view>
				</view>
			</view>
			<view class="line"></view>
			<view class="other-box">
				<view class="services">
					<text class="tit">服务&nbsp&nbsp</text>
					<text class="content">30天保障·终身售后·赠送礼包</text>
				</view>
				<view class="line"></view>
				<view class="delivery">
					<text class="tit">配送&nbsp&nbsp</text>
					<text class="content">空运配送·汽运配送·买家自提</text>
				</view>
				<view class="line"></view>
			</view>
		</view>

		<!--商家信息-->
		<view class="business-information">
			<view class="tit">
				<view class="text">
					商家信息
				</view>
				<view class="more text-arrow">
					店铺
				</view>
			</view>
			<view class="content">
				<image class="img" src="../../static/images/business/002.png" mode=""></image>
				<view class="text1">
					高端精品宠物服务店
				</view>
				<view class="text2">
					福建 厦门
				</view>
				<view class="text2">
					在售47只 | 好评49条 | 等级5星
				</view>
			</view>
		</view>

		<!--买家评价-->
		<view class="comments">
			<view class="tit">
				<view class="text">
					买家评价
				</view>
				<view class="more text-arrow">
					全部
				</view>
			</view>
			<view class="content">
				<view class="item">
					<image class="img" src="../../static/images/business/002.png" mode=""></image>
					<view class="text1">
						手机用户0084
					</view>
					<view class="text2">
						5.0分 超满意
					</view>
					<view class="text2">
						【默认好评】通过平台担保交易买到一只泰迪
					</view>
				</view>
				<view class="item">
					<image class="img" src="../../static/images/business/002.png" mode=""></image>
					<view class="text1">
						手机用户0084
					</view>
					<view class="text2">
						5.0分 超满意
					</view>
					<view class="text2">
						【默认好评】通过平台担保交易买到一只泰迪
					</view>
				</view>
				<view class="item">
					<image class="img" src="../../static/images/business/002.png" mode=""></image>
					<view class="text1">
						手机用户0084
					</view>
					<view class="text2">
						5.0分 超满意
					</view>
					<view class="text2">
						【默认好评】通过平台担保交易买到一只泰迪
					</view>
				</view>
			</view>
		</view>

		<!--投诉举报-->
		<view class="report">
			<view class="tit">
				<view class="text">
					投诉举报
				</view>
				<view class="more text-arrow">
					举报
				</view>
			</view>
			<view class="content">
				<view class="text">
					若您遇到商家涉及服务态度、诚信、私下交易或其他不规范问题，请及时举报，平台核实后将依规处理！
				</view>
			</view>
		</view>

		<!--底部-->
		<view class="footer">
			<view class="footer-item">
				<view class="image-container">
					<image class="icon" src="../../static/images/store.png"></image>
				</view>
				<view class="text">店铺</view>
			</view>
			<view class="footer-item">
				<view class="image-container">
					<image class="icon" src="../../static/images/customer.png"></image>
				</view>
				<view class="text">客服</view>
			</view>
			<view class="footer-item">
				<view class="image-container">
					<image class="icon" src="../../static/images/order.png"></image>
				</view>
				<view class="text">收藏</view>
				<view class="badge"></view>
			</view>
			<view class="footer-item action">
				加入购物车
			</view>
			<view class="footer-item action">
				立即购买
			</view>
		</view>
		<!--瀑布流-->
		<view class="waterfall">
			<waterFall></waterFall>
		</view>

	</view>
</template>

<script>
   import waterfall from '../../components/waterFall/waterFall.vue';
	
</script>

<style lang="scss" scoped>
	@use "detail";
</style>